// pages/fwxx/fwxx.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    name: '',
    gender: 'male',
    phone: '',
    code: '',
    frontImage: '',
    backImage: '',
    codeBtnText: '获取验证码',
    codeBtnDisabled: false,
    countdown: 60,
    showToast: false,
    toastMsg: '',
    canSubmit: false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
    // 清除定时器
    if (this.timer) {
      clearInterval(this.timer);
    }
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },

  /**
   * 返回上一页
   */
  navigateBack() {
    wx.navigateBack();
  },

  /**
   * 输入姓名
   */
  inputName(e) {
    this.setData({
      name: e.detail.value
    });
    this.checkForm();
  },

  /**
   * 选择性别
   */
  selectGender(e) {
    const value = e.currentTarget.dataset.value;
    this.setData({
      gender: value
    });
    this.checkForm();
  },

  /**
   * 输入手机号
   */
  inputPhone(e) {
    this.setData({
      phone: e.detail.value
    });
    this.checkForm();
  },

  /**
   * 输入验证码
   */
  inputCode(e) {
    this.setData({
      code: e.detail.value
    });
    this.checkForm();
  },

  /**
   * 获取验证码
   */
  getVerificationCode() {
    const phone = this.data.phone;

    if (!phone) {
      this.showToast('请输入手机号');
      return;
    }

    // 简单的手机号验证
    if (!/^1[3-9]\d{9}$/.test(phone)) {
      this.showToast('请输入正确的手机号');
      return;
    }

    // 开始倒计时
    this.setData({
      codeBtnDisabled: true,
      codeBtnText: `${this.data.countdown}s后重新发送`
    });

    // 模拟发送验证码
    wx.showLoading({
      title: '发送中...',
    });

    setTimeout(() => {
      wx.hideLoading();
      wx.showToast({
        title: '验证码发送成功',
        icon: 'success'
      });

      // 倒计时
      let countdown = this.data.countdown;
      this.timer = setInterval(() => {
        countdown--;
        if (countdown <= 0) {
          clearInterval(this.timer);
          this.setData({
            codeBtnText: '获取验证码',
            codeBtnDisabled: false
          });
        } else {
          this.setData({
            codeBtnText: `${countdown}s后重新发送`
          });
        }
      }, 1000);
    }, 1500);
  },

  /**
   * 上传人像面照片
   */
  uploadFront() {
    this.uploadImage('front');
  },

  /**
   * 上传国徽面照片
   */
  uploadBack() {
    this.uploadImage('back');
  },

  /**
   * 上传图片
   */
  uploadImage(type) {
    wx.chooseImage({
      count: 1,
      sizeType: ['compressed'],
      sourceType: ['album', 'camera'],
      success: (res) => {
        const tempFilePath = res.tempFilePaths[0];

        // 模拟上传图片
        wx.showLoading({
          title: '上传中...',
        });

        setTimeout(() => {
          wx.hideLoading();

          if (type === 'front') {
            this.setData({
              frontImage: tempFilePath
            });
          } else {
            this.setData({
              backImage: tempFilePath
            });
          }

          this.checkForm();
        }, 1500);
      }
    });
  },

  /**
   * 检查表单是否填写完整
   */
  checkForm() {
    const { name, phone, code, frontImage, backImage } = this.data;

    if (name && phone && code && frontImage && backImage) {
      this.setData({
        canSubmit: true
      });
    } else {
      this.setData({
        canSubmit: false
      });
    }
  },

  /**
   * 显示提示信息
   */
  showToast(msg) {
    this.setData({
      showToast: true,
      toastMsg: msg
    });

    setTimeout(() => {
      this.setData({
        showToast: false
      });
    }, 2000);
  },

  /**
   * 提交表单
   */
  submitForm() {
    if (!this.data.canSubmit) {
      this.showToast('请填写完整信息');
      return;
    }

    wx.showLoading({
      title: '提交中...',
    });

    // 模拟提交表单
    setTimeout(() => {
      wx.hideLoading();
      wx.showToast({
        title: '提交成功',
        icon: 'success'
      });

      // 提交成功后跳转到其他页面
      setTimeout(() => {
        wx.navigateBack();
      }, 1500);
    }, 2000);
  }
})